<template>
    <div>
        <input type="text" placeholder="这是子组件" :value="model">
        <input type="button" value="vm.$emit" @click="fn">
        <input type="button" value="调用父组件的方法" @click="$parent.childHandle('child')">
    </div>
</template>

<script type="text/javascript">
// 按理说子组件没有调用父组件的能力
// 既然是组件，应该只能被调用
export default {
    name: 'child',
    components: {},
    props: {
        model: {
            type: String,
            default: '子组件默认值'
        }
    },
    data() {
        return {}
    },
    mounted() {},
    methods: {
        parentHandle(param) {
            console.log('父组件调用了该方法' + param);
        },
        // 
        fn() {
            this.$emit('eventHandle', 'this is $emit');
        },
    }
}
</script>

<style lang="less" scoped>
</style>